.home {
    height: 6vh;
    background: #0C1212;
    width: 100vw;
    /*text-align: center;*/
    /*opacity: 0.9;*/
    box-shadow: 0 10px 40px rgba(28, 39, 41, 0.8);
    background: -moz-linear-gradient(top, #272727 0%, #181818 50%, #070707 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5D6464), color-stop(50%, #181818), color-stop(100%, #070707));
    background: -webkit-linear-gradient(top, #272727 0%, #181818 50%, #070707 100%);
    background: -o-linear-gradient(top, #272727 0%, #181818 50%, #070707 100%);
    background: -ms-linear-gradient(top, #272727 0%, #181818 50%, #070707 100%);
    background: linear-gradient(to bottom, #272727 0%, #181818 50%, #070707 100%);
}

.left {
    left: 0;
    top: 0;
    position: absolute;
}

.left h4 {
    color: #15B2D8;
    line-height: 6vh;
    margin-left: 2vw;
    font-family: "华文琥珀";
}

.left h5 {
    position: absolute;
    color: #15B2D8;
    line-height: 6vh;
    /*margin-left: 25vw;*/
    left: 48%;
    /*top: 50%;*/
}

.right {
    color: #ffffff;
    font-family: "微软雅黑", serif;
    top: 0;
    right: 0;
    position: absolute;
}

ul {
    list-style: none;
    padding: 0;
    margin: 0 2vw 0 0;
    line-height: 3vh;
    overflow: hidden;
}

/*移除百度地图logo*/
.anchorBL {
    display: none
}

/*header*/
.home .right > ul > li {
    float: left;
    margin-left: 1vw;
}

.home .right > ul > li > span {
    margin-top: 0.5vh;
    height: 2vh;
    display: block;
    font-size: 0.9rem;
    text-align: center;
}

.home .right > ul #time {
    font-size: 1.9rem;
    line-height: 6vh;
}

/*body*/
.main {
    width: 100vw;
    height: 100vh;
    position:fixed;
    background: #213134;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    background-position: center 0;
}

.title {
    /*padding: 0.5vh 0;*/
    color: #3EAACC;
    font-size: 1rem;
    width: 24vw;
    text-align: center;
    height: 7.5vh;
    line-height: 7.5vh;
    /*padding-bottom: 2vh;*/
    /*line-height: 5vh;*/
}

.middle {
    position: absolute;
    left: 25vw;
    top: 0;
    width: 50vw;
    height: 100vh;
}

.title > .rt, .rb, .lt, .lb {
    width: 10px;
    height: 10px;
    position: absolute;
}

/*.title .lt {*/
/*border-top: 1.5px solid rgba(0, 211, 231, 0.5);*/
/*border-left: 1.5px solid rgba(0, 211, 231, 0.5);*/
/*left: -2px;*/
/*top: -2px;*/
/*}*/

/*.title .rt {*/
/*border-top: 1.5px solid rgba(0, 211, 231, 0.5);*/
/*border-right: 1.5px solid rgba(0, 211, 231, 0.5);*/
/*right: -2px;*/
/*top: -2px;*/
/*}*/

/*.title .rb {*/
/*border-bottom: 1.5px solid rgba(0, 211, 231, 0.5);*/
/*border-right: 1.5px solid rgba(0, 211, 231, 0.5);*/
/*right: -2px;*/
/*bottom: -2px;*/
/*}*/

/*.title .lb {*/
/*border-bottom: 1.5px solid rgba(0, 211, 231, 0.5);*/
/*border-left: 1.5px solid rgba(0, 211, 231, 0.5);*/
/*left: -2px;*/
/*bottom: -2px;*/
/*}*/

.title .title-left {
    font-size: 1.4rem;
}

.title i {
    margin: 0.5vh 1vw 0.8vh 0;
}

/*左侧*/
.leftMenu {
    position: absolute;
    left: 0;
    top: 0;
    box-shadow: 0 20px 50px rgba(28, 39, 41, 0.8) inset;
    margin-top: 8vh;
    background: rgba(0, 0, 0, 0.6);
    margin-left: 1vw;
}

::-webkit-scrollbar {
    display: none
}

.bar {
    width: 24vw;
    height: 24vh;
    margin-top: 18vh;
}

.basic {
    width: 24vw;
    height: 20vh;
    color: #3EAACC;
}
.basic .basicDiv{
    position: absolute;
    overflow: hidden;
    color: #3EAACC;
    width: 24vw;
    height: 20vh;
}
.basic .basicDiv ul{
    margin: 0.1vw;
    width: 24vw;
    /*height: 10vh;*/
}
.bar > .rt, .rb, .lt, .lb {
    width: 10px;
    height: 10px;
    position: absolute;
}

.Map {
    width: 24vw;
    height: 32vh;
    margin-top: 44vh;
}

.Map > .rt, .rb, .lt, .lb {
    width: 10px;
    height: 10px;
    position: absolute;
}

.graph {
    width: 24vw;
    height: 21vh;
    margin-top: 78vh;
}
.graph .toiletTitle{
    color: #3EAACC;
    font-size: 1rem;
    text-align: center;
    margin-top: 0.2rem
}
.graph .Toilet{
    color: #3EAACC;
    text-align: center;
    font-size: 0.875rem;
    margin-top: 0.2rem
}
.graph .toilet{
    width: 80%;
    height: 3vh;
    /*text-align: center;*/
    background: #3EAACC;
    color: #fff;
    margin-left: 1vw;
    margin-top: 1rem;
    border-radius: 5px;
}
.graph .toilet span{
    font-size: 0.7rem;
    text-align: center;
    line-height: 3vh;
}
.graph > .rt, .rb, .lt, .lb {
    width: 10px;
    height: 10px;
    position: absolute;
}


.rightMenu {
    position: absolute;
    right: 0;
    top: 0;
    box-shadow: 0 20px 50px rgba(28, 39, 41, 0.8) inset;
    background: rgba(0, 0, 0, 0.6);
    margin-top: 8vh;
    margin-right: 1vw;
}

.weather {
    width: 24vw;
    height: 24vh;
    color: #3EAACC;
    text-align: center;
    margin-top: 18vh;
}

.weather .weatherIcon, .wind {
    margin-left: 1.5vw;
}

.weather .today {
    margin-top: 1.5rem;
}

.weather .tomorrow {
    font-size: 0.9rem;
    margin-top: 1.5rem
}

.weather > .rt, .rb, .lt, .lb {
    width: 10px;
    height: 10px;
    position: absolute;
}

.weather .title-left {
    font-size: 0.8rem;
}

.pie {
    width: 24vw;
    height: 32vh;
    margin-top: 44vh;
}

.pie > .rt, .rb, .lt, .lb {
    width: 10px;
    height: 10px;
    position: absolute;
}

.pie .title-left {
    font-size: 0.8rem;
}

.dashboard {
    width: 24vw;
    height: 21vh;
    margin-top: 78vh;
}
.carportTitle{
    color: #3EAACC;
    font-size: 1rem;
    text-align: center;
    margin-top: 0.2rem
}
.carport {
    color: #3EAACC;
    font-size: 0.875rem;
    text-align: center;
    margin-top: 0.2rem
}
 .carport .carportBig{
    width: 96%;
    height: 3vh;
    /*text-align: center;*/
    background: #3EAACC;
    color: #fff;
    margin-left: 0.3vw;
    margin-top: 1rem;
    border-radius: 5px;
}
.carport span{
    font-size: 0.7rem;
    text-align: center;
    line-height: 3vh;
}
.dashboard > .rt, .rb, .lt, .lb {
    width: 10px;
    height: 10px;
    position: absolute;
}


/*中间*/

/*中间底部文字滚动*/
.bottom {
    position: absolute;
    right: 26vw;
    width: 48vw;
    top: 8vh;
    height: 7.5vh;
    box-shadow: 0 20px 50px rgba(28, 39, 41, 0.8) inset;
    background: rgba(0, 0, 0, 0.6);
}

.bottomDiv {
    position: absolute;
    overflow: hidden;
    color: #3EAACC;
    line-height: 7.5vh;
    width: 48vw;
    height: 7.5vh;
}
.bottomDiv .gradient {
    width: 21.5vw;
    height: 0.3rem;
    margin-top: 3.5vh;
}

.bottomDiv .leftline {
    background: -webkit-linear-gradient(left,rgba(183,214,222,0),rgba(62,170,204,1)); /* Safari 5.1 - 6 */
    background: -o-linear-gradient(right,rgba(183,214,222,0),rgba(62,170,204,1)); /* Opera 11.1 - 12*/
    background: -moz-linear-gradient(right,rgba(183,214,222,0),rgba(62,170,204,1)); /* Firefox 3.6 - 15*/
    background: linear-gradient(to right, rgba(183,214,222,0),rgba(62,170,204,1)); /* 标准的语法 */
    /*background-color: #3EAACC;*/
    float: left;
    margin-left: 0.5vw
}
.bottomDiv .rightline {
    background: -webkit-linear-gradient(right,rgba(183,214,222,0),rgba(62,170,204,1)); /* Safari 5.1 - 6 */
    background: -o-linear-gradient(left,rgba(183,214,222,0),rgba(62,170,204,1)); /* Opera 11.1 - 12*/
    background: -moz-linear-gradient(left,rgba(183,214,222,0),rgba(62,170,204,1)); /* Firefox 3.6 - 15*/
    background: linear-gradient(to left, rgba(183,214,222,0),rgba(62,170,204,1)); /* 标准的语法 */
    /*background-color: #3EAACC;*/
    float: right;
    margin-left: 0.5vw
}

.bottomDiv img{
    height: 8.5vh;
    width: 8.5vh;
    position: absolute;
}

/*中间视频*/
.video {
    position: absolute;
    top: 18vh;
    box-shadow: 0 20px 50px rgba(28, 39, 41, 0.8) inset;
    background: rgba(0, 0, 0, 0.6);
    right: 26vw;
    width: 48vw;
    height: 52vh;

}
.video .leftvideo{
    left: 1vw
}
.video .rightvideo{
    left: 44vw;
}
.video .videoPhoto {
    position: absolute;
    z-index: 9999;
    width: 3vw;
    height: 9vh;
    background:rgba(90, 90, 90, 0.8);
    top: 25.5vh;
    opacity: 0.65;
}
.video .videoPhoto i{
    font-size: 4rem;
    line-height: 8vh;
    /*text-align: center;*/
    margin-left: 1vw;
    color: white;
}
.video > .rt, .rb, .lt, .lb {
    width: 10px;
    height: 10px;
    position: absolute;
}

/*中间轮播图介绍*/
.Introduction {
    position: absolute;
    top: 72vh;
    box-shadow: 0 20px 50px rgba(28, 39, 41, 0.8) inset;
    background: rgba(0, 0, 0, 0.6);
    /*margin-top: 8vh;*/
    right: 26vw;
    width: 48vw;
    height: 24vh;
}
.Introduction > .rt, .rb, .lt, .lb {
    width: 10px;
    height: 10px;
    position: absolute;
}

#banner {
    position: relative;
    width: 48vw;
    height: 24vh;
    overflow: hidden;
}

#banner_list div {
    width: 48vw;
    height: 24vh;
}
#banner_list div > p  {
    /*float: right;*/
}
#banner_list div >img {
    position: absolute;
    width: 18vw;
    height: 21vh;
    margin: 0.6rem;
}

#banner_list div .bannertitle {
    color: #3EAACC;
    font-size: 1.5rem;
    text-align: center;
    margin-left: 19vw;
    margin-bottom: 0;
}
#banner_list div .bannertext{
    color: #3EAACC;
    margin-left: 19vw;
    margin-right:0.875rem;
    text-indent: 2rem;
    text-align: left;
    font-size: 0.9rem
}

/*#banner_bg {*/
/*position: absolute;*/
/*bottom: 0;*/
/*background-color: #000;*/
/*height: 30px;*/
/*filter: Alpha(Opacity=30);*/
/*opacity: 0.3;*/
/*z-index: 1000;*/
/*cursor: pointer;*/
/*width: 40vw;*/
/*}*/

/*#banner_info {*/
/*position: absolute;*/
/*bottom: 0;*/
/*left: 5px;*/
/*height: 15px;*/
/*color: #fff;*/
/*z-index: 1001;*/
/*cursor: pointer*/
/*}*/

/*#banner_text {*/
/*position: absolute;*/
/*width: 120px;*/
/*z-index: 1002;*/
/*right: 3px;*/
/*bottom: 3px;*/
/*}*/

#banner ul {
    position: absolute;
    list-style-type: none;
    filter: Alpha(Opacity=80);
    opacity: 0.8;
    z-index: 1002;
    margin: 0;
    padding: 0;
    bottom: 3px;
    right: 5px;
    text-align: center;
}

#banner ul li {
    padding: 0 3px;
    height: 20px;
    float: left;
    display: block;
    color: #FFF;
    background: #6f4f67;
    cursor: pointer;
    border: 1px solid #333;
    /*text-align: left;*/
    /*margin-left: qopx;*/
    line-height: 18px;

}

#banner ul li.on {
    background-color: #000;
    text-align: center;
}

#banner_list div {
    position: absolute;
}

.all {
    width: 10px;
    height: 10px;
    position: absolute;
}

.lt {
    border-top: 1.5px solid rgba(0, 211, 231, 0.5);
    border-left: 1.5px solid rgba(0, 211, 231, 0.5);
    left: -2px;
    top: -2px;
}

.rt {
    border-top: 1.5px solid rgba(0, 211, 231, 0.5);
    border-right: 1.5px solid rgba(0, 211, 231, 0.5);
    right: -2px;
    top: -2px;
}

.rb {
    border-bottom: 1.5px solid rgba(0, 211, 231, 0.5);
    border-right: 1.5px solid rgba(0, 211, 231, 0.5);
    right: -2px;
    bottom: -2px;
}

.lb {
    border-bottom: 1.5px solid rgba(0, 211, 231, 0.5);
    border-left: 1.5px solid rgba(0, 211, 231, 0.5);
    left: -2px;
    bottom: -2px;
}

li {
    line-height: 1.5rem;
    text-indent: 2rem;
    font-style: normal;
}

.bottomtext {
    position: absolute;
    width: 30vw;
    background: rgba(0, 0, 0, 0.6);
    bottom: 1.2vh;
    left: 35vw;
    color: white;
    font-size: 0.7rem;
    text-align: center;
}

.bottomtext span {
    color: rgba(0, 0, 0, 0);
}
.basic {
    font-size: 1rem;
}
